<template>
  <div>
    <div class="box">
      <div
        class="shop"
        v-for="item in allshop"
        :key="item.id"
      >
        <a @click="goto('/shopdetail','ShopDetail',item.id)">

          <img :src="'http://139.198.178.82:9090/Shopping/'+item.defaultImg">
          <p>
            {{item.name}}
          </p>
        </a>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "allshop",
  data() {
    return {
      allshop: [],
    };
  },
  methods: {
    getallshop() {
      this.$post(this.url + "/product/select", {}).then((res) => {
        if (res.errorCode == "0") {
          this.allshop = res.data;
          console.log(this.allshop);
        }
      });
    },
    goto(path, name, val) {
      sessionStorage.setItem("shopid", val);
      this.$router.push({
        path: path,
        name: name,
      });
    },
  },
  created() {
    this.getallshop();
  },
};
</script>

<style scoped>
.box {
  width: 85%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
}
.shop {
  width: 18%;
  border: 1px solid lightgray;
  margin: 10px;
}
img {
  width: 100%;
}
</style>